<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>店铺分布</title>
		<link rel="stylesheet" href="css/main.css?v=1" />
		<script type="text/javascript" src="js/jquery.min.js"></script>
		<script type="text/javascript" src="js/bootstrap.min.js"></script>
		<script type="text/javascript" src="js/toastr.js"></script>
		<style type="text/css">
			.panel {
				position: fixed;
				z-index: 2;
				width: 300px;
				right: 20px;
				top: 20px;
			}
			
			.panel > .panel-body {
				overflow-y: scroll;
				height: calc(100vh - 100px);
				padding: 0;
			}
			.item {
				width: 100%;
				height: 60px;
				position: relative;
				border-bottom: dotted 1px #ccc;
				background-color: #FFFFFF;
			}
			.item:hover {
				background-color: #EEEEEE;
			}
			.item > img {
				border:3px solid #FFFFFF;
				box-shadow: 0 0 5px #333;
				border-radius: 50%;
				height: 50px;
				width: 50px;
				position: absolute;
				top:5px;
				left: 5px;
			}
			.item > .title {
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				text-indent: 65px;
				font:bold 14px/30px "微软雅黑";
			}
			.item > .action {
				text-align: right;
				padding-right: 5px;
			}
			.item > .action > a {
				margin: 0 5px;
			}
		</style>
	</head>

	<body>
		<iframe name="gis" style="width: 100%; height: 100%;position: fixed; z-index: 1;" frameborder="0" src="gis.html"></iframe>
		<div class="panel panel-primary">
			<div class="panel-heading">
				<h3 class="panel-title">商铺列表</h3>
			</div>
			<div class="panel-body">
				<div class="item">
					<img src="img/_noimg.png" onerror="this.src='img/_noimg.png'" />
					<div class="title">大师傅大师傅撒地方阿萨德范德萨发大师傅阿斯顿发大水发</div>
					<div class="action">
						<a class="_btn1" href="javascript:void(0);">查看</a>
						<a class="_btn2" href="javascript:void(0);">详情</a>
					</div>
				</div>
			</div>
		</div>
		<div id="loading" style="width: 100%; height: 100%;position: fixed; z-index: 3; background-color: rgba(0,0,0,.5); display: flex; align-items: center; justify-content: center;">
			<div><i class="fa fa-spin fa-spinner fa-fw fa-4x" style="color: #FFF;"></i></div>
		</div>
		<script type="text/javascript" src="shops-map.js"></script>
	</body>

</html>